<template>
  <section v-loading="loading" class="cms-body">
    <!--  <div class="cms-list-header">
           <el-button type="primary"
             @click="routerLink('/message/add','save',0)"
             v-perms="'/message/add'"
           >发送站内信</el-button>
    <div class="cms-list-header">
               <span class="demonstration cms-label">发送时间</span>
               <el-date-picker
                 v-model="value4"
                 type="datetimerange"
                 :picker-options="pickerOptions2"
                 range-separator="至"
                 :editable='false'
                 start-placeholder="开始日期"
                 end-placeholder="结束日期"
                 align="right"
                 value-format="yyyy-MM-dd HH:mm:ss"
                 @change='getTime()'
                 >
               </el-date-picker>
       </div>-->
    <div class="cms-list-header">
      <cms-input v-model="params.title" label="标题"></cms-input>
      <el-button @click="query">查询</el-button>
    </div>
    <el-table :data="tableData" stripe style="width: 100%" @selection-change="checkIds">
      <el-table-column type="selection" width="65" align="right"></el-table-column>
      <el-table-column prop="id" label="ID" width="50" align="center"></el-table-column>
      <el-table-column prop="msgTitle" label="标题" align="center">
        <div slot-scope="scope">
          <a @click="routerLink('/message/seek','',scope.row.id,{box:scope.row.msgBox})">{{scope.row.msgTitle}}</a>
        </div>
      </el-table-column>
      <el-table-column prop="msgSendUserUserName" label="发件人" align="center"></el-table-column>
      <el-table-column prop="sendTime" label="发送时间" align="center"></el-table-column>
    </el-table>
    <!-- 表格底部 -->
    <div class="cms-list-footer">
      <div v-if="params.box!=3" class="cms-left">
        <el-button :disabled="disabled" @click="deleteBatch($api.messageTrash,ids)"
                   v-perms="'/message/delete'"
        >批量删除
        </el-button>
      </div>

      <div v-if="params.box==3" class="cms-left">
        <el-button :disabled="disabled" @click="revertBatch($api.messageRevert,ids)"
                   v-perms="'/message/revert'"
        >还原
        </el-button>
      </div>
      <div v-if="params.box==3" class="cms-left">
        <el-button :disabled="disabled" @click="deleteBatch($api.messageEmpty,ids)"
                   v-perms="'/message/deletes'"
        >彻底删除
        </el-button>
      </div>
      <!-- cms分页组件 -->
      <cms-pagination :total="total" @change="getPages"></cms-pagination>
    </div>
  </section>
</template>

<script>
  import listMixins from '@/mixins/list'

  export default {
    mixins: [listMixins],
    data() {
      return {
        pickerOptions2: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
        },
        value3: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
        value4: '',
        params: {//只需要业务参数
          title: "",
          sendBeginTime: "",
          sendEndTime: "",
          status: "",
          box: '',
          pageNo: '',
          pageSize: '',
        }
      };
    }, methods: {
      getTime() {
        if (this.value4 === null) {
          this.params.sendBeginTime = '';
          this.params.sendEndTime = '';
        } else {
          this.params.sendBeginTime = this.value4[0];
          this.params.sendEndTime = this.value4[1];
        }
        this.query();
      }
    },
    created() {
      this.initTableData(this.$api.messageList, this.params);
    }
  };
</script>

<style>

</style>
